<template>
	<view class="order-pages">
		<!-- #ifndef H5 -->
		<fixed top="0">
		<!-- #endif -->
			<!-- #ifdef H5 -->
			<fixed>
			<!-- #endif -->
				<tab @change="handerTabChange" :list="tabList" :activeIndex="activeIndex*1" :activeColor="primaryColor"
					:width="100/tabList.length + '%'" height="100rpx"></tab>
				<view class="b-1px-b"></view>
			</fixed>
			<abnor v-if="list.length<=0"></abnor>
			<view v-else>
				<view 
					class="item-child mt-md ml-md mr-md pd-lg fill-base radius-16 rel" v-for="(item,index) in list"
					:key="index">
					<view class="code left" style="justify-content: space-between;font-size: 32rpx;font-weight: bold;margin-bottom: 8rpx;">
						<view class="">
							订单号:{{item.order.order_code}}
						</view>
						<view class="" :class="item.diet_status == '已核销'?'greed':'red'">
							{{item.diet_status}}
						</view>
					</view>
					<view class="" style="margin-bottom: 8rpx;display: flex;align-items: center;justify-content: space-between;">
						<view class="">
							预定项目:{{item.service.title}}
						</view>
						<view class="red">
							价格:{{item.order.price}}
						</view>
					</view>
					<view style="margin-bottom: 8rpx;">
						预定人数:{{item.people_number}}
					</view>
					<view class="" style="margin-bottom: 8rpx;">
						预定房间:{{item.house.title}}
					</view>
					<view class="">
						预定人:{{item.user.nickName}}
					</view>
					<view class="" style="margin-bottom: 8rpx;">
						联系电话:{{item.user.phone}}
					</view>
					
					<view class="" style="margin-bottom: 8rpx;">
						预定时间:{{$u.timeFormat(item.start_time, 'yyyy年mm月dd日 hh时MM分ss秒')}}
					</view>
					
				</view>
			</view>
		</fixed>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				activeIndex: 0,
				tabList: [{
					title: '全部',
					id: '-1'
				},  {
					title: '已核销',
					id: 1
				},{
					title: '未核销',
					id: 0
				}],
				statusType: {
					'-1': '已取消',
					1: '待支付',
					2: '待服务',
					// 3: this.$t('action.attendantName') + '接单',
					// 4: this.$t('action.attendantName') + '出发',
					// 5: this.$t('action.attendantName') + '到达',
					6: '服务中',
					7: '已完成',
					// 8: '待转单'
				},
				statusTypes: {
					'-1': '已取消',
					1: '待支付',
					2: '待接单',
					3: '已接单',
					// 4: this.$t('action.attendantName') + '出发',
					// 5: this.$t('action.attendantName') + '到达',
					6: '用餐中',
					7: '已完成',
					// 8: '待转单'
				},
				primaryColor: '#1eb481',
				param: {
					pages: 1,
					diet_status: '-1'
				},
				list: [],
				last_page: 0,
				current_page: 0
			}
		},
		async onLoad(options) {
			this.getList()
		},
		onShow() {
			this.getList()
		},
		onPullDownRefresh() {
			// #ifndef APP-PLUS
			uni.showNavigationBarLoading()
			// #endif
			this.getList()
			uni.stopPullDownRefresh()
		},
		onReachBottom() {
			if (this.current_page >= this.last_page) {
				uni.showToast({
					icon: 'error',
					title: '暂无数据'
				})
				return;
			}
			this.param.page = Number(this.param.page) + 1
			this.getList()
		},
		methods: {
			handerTabChange(index) {
				uni.pageScrollTo({
					scrollTop: 0
				})
				// this.list = []
				this.activeIndex = index
				this.param.diet_status = this.tabList[index].id
				this.getList()
			},
			async getList() {
				let list = await this.$api.dietitian.coachDietOrder(this.param)
				console.log(list);
				this.list = list
				// this.last_page = list.last_page
				// this.current_page = list.current_page
				this.$util.hideAll()
			},
			goDetail(index, page) {
				let {
					id
				} = this.list[index]
				let url = `/user/pages/order/${page}?id=${id}&type=9`
				this.$util.goUrl({
					url
				})
			},
			async jiedan(id,type){
				let data = await this.$api.technicianadd.changeEatOrder({
					order_id:id,
					 pay_type:type
				})
				let title = ''
				if(type == 3){
					title = '接单成功'
				}
				if(type == 6){
					title = '开始用餐'
				}
				if(type == 7){
					title = '结束用餐'
				}
				uni.showToast({
					icon: 'success',
					title: title
				})
				this.getList()
			}
		}
	}
</script>


<style lang="scss">
	.btn{
		background-color: #07c160;
		color: #fff;
		border-radius: 18rpx;
		text-align: center;
		padding: 20rpx 16rpx;
		font-size: 28rpx;
	}
	.red{
		color: red;
	}
	.greed{
		color: #07c160;
	}
</style>